<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <link rel="icon" href="img/favicon.ico">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="layui/css/layui.css">
    <link rel="stylesheet" href="css/reset.css">
    <link rel="stylesheet" href="css/vendor.min.css">
    <link rel="stylesheet" href="css/plugins.min.css">
    <link rel="stylesheet" href="css/style.min.css">
    <style>
        html{
            height: 100%;
            overflow-y: hidden;
        }
        body{
            height: 100%;
            overflow-y: auto;
        }
        .aaa{
            padding:0 15px;height:35px;line-height:32px;font-size:14px;text-transform:uppercase
        }
        .floor_tit {
            height: 33px;
            font-size: 25px;
            color: #333;
            line-height: 33px !important;
            font-weight: bold;
            text-align: center;
        }
        .anniu{
            border: 3px solid #014881;border-radius: 20px;background-color: #2789D5;height: 50px;line-height: 50px;
            font-weight: 500;color: white;text-align: center;cursor: pointer;
        }
    </style>
</head>
<body>

<div class="container" style="margin-top: 20px;">
    <h2 class="title">促销活动</h2>
    <div id="detail"></div>
    <div style="padding-top: 50px;">
        <div class="main-box ltjxDrop ltjxWarp">
            <div class="lx_jx_header">
                <p class="floor_tit"><span class="editeTxt" i18n="">常用软件套餐</span></p>
            </div>
            <div class="product-grid-view row" id="combo">
<!--                <div class="swiper-slide" style="width: 23%;margin: 10px 1%;">-->
<!--                    <div class="product-item">-->
<!--                        <div class="product-img img-zoom-effect">-->
<!--                            <img class="img-full" src="http://store.etllao.com/wp-content/uploads/2022/07/Etlpackage_update.png">-->
<!--                        </div>-->
<!--                        <div style="font-size: 15px;margin-top: 6px;" onclick="toUrl(111)">-->
<!--                            <div class="anniu">REGISTER NOW</div>-->
<!--                        </div>-->
<!--                    </div>-->
<!--                </div>-->
            </div>
        </div>
    </div>
</div>

<script src="js/vendor.min.js"></script>
<script src="js/plugins.min.js"></script>
<script src="js/main.min.js"></script>
<script src="layui/layui.js"></script>
<script src="js/token.js"></script>
<script src="js/config.js"></script>
<script src="js/jquery.i18n.min.js"></script>
<script src="js/multi_lang_config.js"></script>
<script>

    var layer = layui.layer;
    var form = layui.form;

    var moduleName = "subMain";
    var defaultLang = layui.data('langTab').langType;
    initLangConfig({
        defaultLang:defaultLang,
        filePath: "js/i18n/"+moduleName+"/",
        module:moduleName,
        base:"js/"
    })
    var i18np = null;
    function changeLang(lang) {
        defaultLang = lang;
        reloadI18n({
            defaultLang:lang,
            filePath: "js/i18n/"+moduleName+"/",
            module:moduleName,
        })
        i18np.loadProperties(moduleName);
        cxhlDataInit();
    }

    layui.config({base: 'js/'})
        // 继承treetable.js插件
        .extend({i18np: 'i18n'}).use([ 'i18np','jquery'], function () {
        i18np = layui.i18np;
        i18np.loadProperties(moduleName);
    });

    //常用软件套餐
    var trRow = [];
    $.ajax({
        url: HOST + "webapi/combo/getCyCombo",
        type: "GET",
        success: function (res) {
            trRow = res.data;
            var str1 = "";
            for (var i = 0; i < trRow.length; i++) {
                str1 += "<div class=\"swiper-slide\" style=\"width: 23%;margin: 20px 1%;\">\n" +
                    "                                        <div class=\"product-item\">\n" +
                    "                                            <div class=\"product-img img-zoom-effect\">\n" +
                    "                                                <img class=\"img-full\" style='width: 240px;height: 240px;' src=\""+trRow[i].picture+"\">\n" +
                    "                                            </div>\n" +
                    "                                            <div style=\"font-size: 15px;margin-top: 6px;\" onclick=\"toUrl("+i+")\">\n" +
                    "                                                <div class=\"anniu\">REGISTER NOW</div>\n" +
                    "                                            </div>\n" +
                    "                                        </div>\n" +
                    "                                    </div>";
            }
            $("#combo").html(str1);
        }
    })

    //跳转详情页
    function toUrl(i) {
        window.open("popular-package-detail.html?id="+trRow[i].id);
    }

    var cxhlData = {};
    function cxhlDataInit(){
        if (defaultLang == "zh") {
            $('#detail').html(cxhlData.contentZh);
        } else if (defaultLang == "la") {
            $('#detail').html(cxhlData.contentLao);
        } else if (defaultLang == "en") {
            $('#detail').html(cxhlData.contentEn);
        }
    }

    $(function (){
        search();
    })
    function search() {
        $.ajax({
            url: HOST+"phoneOrSales/getPhoneOrSalesByType?type=2",
            type: "GET",
            success: function (res) {
                cxhlData = res.data;
                cxhlDataInit();
            }
        })
    }

</script>
</body>
</html>